/**
 * Prettier 代码格式化工具配置文件
 *
 * 这是一个常用的 Prettier 配置，适用于大多数 JavaScript/TypeScript 项目
 * 更多配置选项参考: https://prettier.io/docs/en/options.html
 *
 * 安装 Prettier: npm install --save-dev prettier
 * 使用方式: npx prettier --write .
 */

module.exports = {
  // ==================== 基本配置 ====================

  // 每行代码的最大长度，超过会自动换行
  // 推荐值: 80-120，80是传统标准，100-120更符合现代开发习惯
  printWidth: 100,

  // 缩进使用的空格数
  // 推荐值: 2（JavaScript标准）或 4（Python风格）
  tabWidth: 2,

  // 是否使用制表符（tab）进行缩进
  // false: 使用空格（推荐，保证跨编辑器一致性）
  // true: 使用制表符
  useTabs: false,

  // 是否在语句末尾添加分号
  // true: 添加分号（推荐，避免潜在问题）
  // false: 不添加分号
  semi: true,

  // ==================== 引号配置 ====================

  // 是否使用单引号代替双引号
  // true: 使用单引号（推荐，更简洁）
  // false: 使用双引号
  singleQuote: true,

  // 对象属性的引号处理方式
  // 'as-needed': 仅在需要时添加引号（推荐，最简洁）
  // 'consistent': 如果有一个属性需要引号，则所有属性都加引号
  // 'preserve': 保留用户输入的引号方式
  quoteProps: 'as-needed',

  // JSX 中使用单引号还是双引号
  // true: JSX中使用单引号（与 singleQuote 保持一致）
  // false: JSX中使用双引号
  jsxSingleQuote: true,

  // ==================== 逗号配置 ====================

  // 在多行逗号分隔的语法结构中，是否添加尾随逗号
  // 'es5': 在 ES5 中有效的尾随逗号（对象、数组等）
  // 'none': 没有尾随逗号
  // 'all': 尽可能添加尾随逗号（包括函数参数，推荐用于现代项目）
  trailingComma: 'all',

  // ==================== 括号配置 ====================

  // 对象字面量的大括号内是否有空格
  // true: { foo: bar }（推荐，更易读）
  // false: {foo: bar}
  bracketSpacing: true,

  // 多行 JSX 元素的 > 是否放在最后一行的末尾，而不是单独一行
  // true:
  //   <button
  //     onClick={handleClick}
  //     className="btn">
  //     点击
  //   </button>
  // false:
  //   <button
  //     onClick={handleClick}
  //     className="btn"
  //   >
  //     点击
  //   </button>
  bracketSameLine: false,

  // 箭头函数参数的括号处理方式
  // 'avoid': 当只有一个参数时省略括号（推荐，更简洁）
  // 'always': 总是包含括号
  arrowParens: 'avoid',

  // ==================== 文件处理配置 ====================

  // 文件范围：针对特定文件类型使用不同的格式化规则
  overrides: [
    {
      files: '*.html',
      options: {
        parser: 'html',
        printWidth: 120, // HTML 文件可以适当放宽行宽限制
      },
    },
    {
      files: '*.css',
      options: {
        parser: 'css',
      },
    },
    {
      files: '*.scss',
      options: {
        parser: 'scss',
      },
    },
    {
      files: '*.less',
      options: {
        parser: 'less',
      },
    },
    {
      files: '*.json',
      options: {
        parser: 'json',
      },
    },
    {
      files: '*.md',
      options: {
        parser: 'markdown',
        proseWrap: 'always', // 始终对 markdown 文本进行换行
      },
    },
    {
      files: '*.yml',
      options: {
        parser: 'yaml',
        singleQuote: false, // YAML 通常使用双引号
      },
    },
  ],

  // ==================== 高级配置 ====================

  // 行尾符设置
  // 'lf': Linux/macOS 风格（推荐用于跨平台项目）
  // 'crlf': Windows 风格
  // 'auto': 自动检测
  endOfLine: 'lf',

  // 是否格式化嵌入在文件中的代码（如 JS 中的 CSS 字符串）
  // 'auto': 自动格式化
  // 'off': 不格式化
  embeddedLanguageFormatting: 'auto',

  // HTML 空白敏感度
  // 'css': 尊重 CSS 的 display 属性
  // 'strict': 所有标签周围的空格都重要
  // 'ignore': 忽略空格
  htmlWhitespaceSensitivity: 'css',

  // Vue 文件中 script 和 style 标签的缩进
  // false: 不缩进（推荐）
  // true: 缩进
  vueIndentScriptAndStyle: false,

  // 插件配置（如果需要使用插件）
  // 常用插件:
  // - '@trivago/prettier-plugin-sort-imports' (导入排序)
  // - 'prettier-plugin-tailwindcss' (Tailwind CSS 类排序)
  // plugins: [],
};
